<template>
  <div
    class="
      mx-2
      p-4
      rounded-md
      bg-white
      shadow-md
      flex
      justify-between
      items-center
    "
  >
    <span class="flex items-center flex-col">
      <van-image :src="user.avatar" round width="3rem" height="3rem">
      </van-image>
      <span class="font-medium text-lg">{{ user.username }}</span>
    </span>

    <div class="flex flex-col justify-around items-end text-xs text-gray-600">
      <span class="">可动: {{ user.coins }} FCB</span>
      <span class=""
        >收益:
        <span class="text-red-500">+{{ parseFloat(user.profit) || 0 }}</span>
        FCB
      </span>
      <span class="">担保: {{ user.buys_frozen_sum_deposit || 0 }} FCB </span>
      <alarm-switch />
    </div>
  </div>
</template>

<script>
import alarmSwitch from './alarm-switch.vue'

export default {
  components: { alarmSwitch },
  computed: {
    user() {
      return this.$store.state.user
    },
    // member() {
    //   return this.$store.state.user.member
    // },
  },
  created() {
    if (!this.user) {
      this.$store.commit('clearUser')
      this.$router.push('/login')
    }
  },
}
</script>

<style>
</style>